const sassResourcesLoader = require('craco-sass-resources-loader');
const path = require('path');

const pathResolve = (pathUrl) => path.join(__dirname, pathUrl);

module.exports = {
  webpack: {
    // 配置别名
    alias: {
      '@': pathResolve('src'),
    },
  },
  style: {
    postcss: {
      plugins: [
        require('autoprefixer')({
          overrideBrowserslist: ['>0.2%', 'not dead', 'not op_mini all'],
        }),
        require('postcss-pxtorem')({
          rootValue: 100,
          selectorBlackList: [], //过滤
          propList: ['*'],
          exclude: /node_modules/i,
        }),
      ],
    },
  },
  plugins: [
    // 配置全局sass变量
    {
      plugin: sassResourcesLoader,
      options: {
        resources: [
          './src/assets/scss/variable.scss',
          './src/assets/scss/common.scss',
        ],
      },
    },
  ],
  module: {
    rules: [
      // 配置sass-loader
      {
        test: /\.s[ac]ss$/i,
        use: ['style-loader', 'css-loader', 'sass-loader'],
      },
    ],
  },
};
